Aside Tag ব্যবহার করার নিয়ম

Welcome to Creationbangla-24. কেমন আছেন বন্ধুরা? আশা করি মহান আল্লাহ্ তা'য়ালার অশেষ রহমতে ভালো আছেন। আপনারা অবশ্যই Title দেখে বুঝতে পেরেছেন এই পেজে কী বিষয় নিয়ে আলোচনা করতে যাচ্ছি। তো আপনাদের জানিয়ে রাখি এটি একটি শিক্ষা বিষয়ক সাইট। এই site এ আমি নির্দিষ্ট কিছু বিষয় নিয়ে ধারাবাহিক ভাবে লিখব। আপনাদের একটি কথা না বললেই নয় যে, এই Page টি ভালোভাবে বুঝার জন্য এবং Page টি থেকে উপকৃত হওয়ার জন্য সম্পূর্ণ Page টি মনযোগ সহকারে পড়বেন। এখন এই পেজটিতে আপনাদের সাথে আলোচনা করতে যাচ্ছি "HTML <aside> Tag" সম্পর্কে এবং আপনাদের সাথে আছি আমি Md.Aiub তো চলুন বন্ধুরা শুরু করা যাক।


Aside tag, aside to sidebar
Aside হলো একটি ইংরেজি শব্দ। যার অর্থ হলো, একপাশে, একান্তে, পৃথকভাবে ইত্যাদি।
HTML-5 এ <aside> একটি নতুন ট্যাগ। যার কাজ হলো ওয়েবপেজে একটি পৃথক কনটেন্ট তৈরি করা। তবে পার্শ্ববর্তী কনটেন্টের সাথে সম্পর্ক বজায় থাকে। তাছাড়া <aside> ট্যাগ কোনো Article এর Sidebar হিসাবেও রূপান্তর করা যায়। <aside> ট্যাগে Global Attribute এবং Event Attribute support করে। <aside> Tag ওয়েবপেজের নকশা করতে সহায়তা করে। HTML Document এর স্পষ্টতা বাড়ায়। মূল কনটেন্টের অধীনস্ত অন্যান্য কনটেন্ট সনাক্ত করতে সাহায্য করে।

<aside> গঠনরীরি
<aside> Tag এর গঠনরীরি হলো: <aside> Tag/Text </aside> অর্থাৎ <aside> ট্যাগ এর আওতাভূক্ত সকল Tag/Text <aside> ও </aside> ট্যাগের মাঝে রাখতে হবে।

নিম্নে aside ট্যাগের জন্য কোডিং করে দেখানো হলো। আপনি চাইলে কোড বা টেক্স পরিবর্তন করে এখানেই অনুশীলন করতে পারেন এবং Run Code Button এ ক্লিক করে উক্ত কোডের Output দেখতে পারেন । আবার আপনি চাইলে Copy Code Button এ ক্লিক করে কোডগুলো কপি করতে পারেন এবং তা আপনার প্রয়োজনে ব্যাবহার করতে পারেন।






উপরিউক্ত Tag বিশ্লেষণ ও কাজের বর্ণনা :
  1. <!doctype html> এটাকে আসলে সম্পূর্ণ কোন Tag বলা হয় না। <!doctype html> ট্যাগ ব্যবহার করা হয় <html> ট্যাগ এর পূর্বে। যা ওয়েব ব্রাউজার কে html এর ভার্সন বলে দেয়। যাতে ওয়েব ব্রাউজার ওয়েব কন্টেন্ট গুলোর সাথে ভালো ভাবে কাজ করতে পারে। আর <!doctype html> ট্যাগ এর প্রধান কাজ হচ্ছে ওয়েব ব্রাউজার কে বলে দেওয়া যে, ওয়েব পেজটির Document type. HTML5 Standard.
  2. <html> ট্যাগ দ্বারা ওয়েব ব্রাউজারকে নির্দেশ করা হয়েছে যে, এই ওয়েব পেজটি HTML ভাষায় তৈরী।
  3. <head> ট্যাগ ওয়েবপেজ সম্পর্কিত তথ্য ধারণ করে। এখানে ওয়েব পেজের শিরোনাম রাখা হয়েছে <head> ট্যাগ এর মাঝে। তাছাড়াও <head> ট্যাগ এর মাঝেই আপনাকে Style sheet, Script, meta ট্যাগ ব্যবহার করতে হবে।
  4. <title> ট্যাগ ওয়েবপেজের শিরোনাম ধারণ করে। <title> ট্যাগ এর মাধ্যমে ওয়েবপেজের শিরোনাম শুরু করা হয়েছে এবং সম্পূর্ণ শিরোনামটি এই ট্যাগ এর মধ্যেই রাখতে হবে।
  5. </title> ট্যাগ এর মাধ্যমে ওয়েবপেজের শিরোনাম শেষ করা হয়েছে। অর্থাৎ <title> ট্যাগ বন্ধ করা হয়েছে। এই ট্যাগ এর বাইরে কিছু লিখলে সেটা ওয়েব পেজের শিরোনাম বলে গণ্য হবে না। উপরে শিরোনাম হিসাবে HTML Aside Tag ব্যবহার করা হয়েছে।
  6. </head> ট্যাগ এর মাধ্যমে <head> বন্ধ করা হয়েছে।
  7. <body> ট্যাগ ওয়েবপজের মূল উপাদান ধারণ করে। আপনি ওয়েবপেজে যা প্রদর্শন করাতে চান সেই সম্পর্কিত সকল ট্যাগ <body> ট্যাগ এর মধ্যে রাখতে হবে।
  8. &60;aside> ট্যাগের মাধ্যমে ওয়েবপেজে একটি পৃথক কনটেন্ট শুরু করা হয়েছে।
  9. <h3> ট্যাগের মাধ্যমে Paragraph এর শিরোনাম লেখা হয়েছে। এই ট্যাগের মাধ্যমে লেখাগুলো Automatically bold style হয় এবং size বড় হয়। <h1> থেকে <h6> পর্যন্ত ট্যাগ রয়েছে, যেগুলোর মাধ্যমে লেখাগুলো ক্রমান্বয়ে বড় থেকে ছোট হতে থাকে এবং bold style হয়।
  10. </h3> Tag এর মাধ্যমে <h3> ট্যাগ বন্ধ করা হয়েছে।
  11. <p> Tag দ্বারা ওয়েব পেজে একটি Paragraph ঘোষণা করা হয়েছে । আপনি প্যারাগ্রাফ হিসাবে যা লিখতে চান তা এই ট্যাগ এর মধ্যে রাখতে হবে। অন্যথায় প্যারাগ্রাফ হলে বিবেচিত হবে না। উপরে <p> Tag এর মাঝে কক্সবাজার সম্পর্কে লেখা হয়েছে।
  12. </p> Tag এর মাধ্যমে <p> ট্যাগ বন্ধ করা হয়েছে।
  13. </aside> Tag এর মাধ্যমে <aside> ট্যাগ বন্ধ করা হয়েছে।
  14. </body> Tag এর মাধ্যমে <body> ট্যাগ বন্ধ করা হয়েছে।
  15. </html> Tag Tag এর মাধ্যমে <html> ট্যাগ বন্ধ করা হয়েছে। অর্থাৎ Html ভাষায় তৈরিকৃত ওয়েজপেজটি শেষ করা হয়েছে। এই ট্যাগ এর বাইরে কিছু লিখলে তা Html ভাষায় তৈরিকৃত ওয়েজপেজটির কোনো Document বলে বিবেচিত হবে না।

ًপ্রিয় পাঠক বন্ধুরা,
আপনারা যদি এই পেজটি পড়ে উপকৃত হন তাহলে আমার পরিশ্রম স্বার্থক হবে। উপকৃত হয়ে থাকলে এই পেজটি আপনার বন্ধুদের মাঝে শেয়ার করতে ভুলবেন না। আপনার মতামত প্রকাশ করতে চাইলে কমেন্ট বক্সে কমেন্ট করতে পারেন। এতোক্ষণ ধর্য্যসহকারে Page টি পড়ার জন্য এবং আপনার মূল্যবান সময় আমাদের সাথে ব্যয় করার জন্য ধন্যবাদ। এর পরের Page এ আপনাদের সাথে "HTML Audio Tag" নিয়ে আলোচনা করবো, সেই সময় পর্যন্ত আমদের সাথে থাকার আমন্ত্রণ রইল। আপনাদের সকলে সুস্বাস্থ্য ও দীর্ঘায়ু কামনা করে আজকের মতো শেষ করছি,
আল্লাহ হফেজ...


Post a Comment

Previous Post Next Post